<template>
  <el-form ref="zzjg_form">
    <el-form-item label="姓名" prop="name">
      <el-input v-model="zzjg_form.name" />
    </el-form-item>
    <el-form-item v-if="isedit" label="职别" prop="position">
      <el-input v-model="zzjg_form.position" />
    </el-form-item>
    <el-form-item v-if="isedit" label="政治面貌" prop="category">
      <el-select v-model="zzjg_form.category">
        <el-option v-for="item in category" :key="item.id" :label="item.data" :value="item.data" />
      </el-select>
    </el-form-item>
    <el-form-item v-if="isedit" label="入wu时间" prop="draftdate">
      <el-date-picker
        v-model="zzjg_form.draftdate"
        type="date"
        placeholder="选择日期"
        style="width: 100%"
      />
    </el-form-item>
    <el-form-item label="入党时间" prop="partydate">
      <el-date-picker
        v-model="zzjg_form.partydate"
        type="date"
        value-format="yyyy-MM-dd"
        placeholder="选择日期"
        style="width: 100%"
      />
    </el-form-item>
    <el-form-item v-if="isedit" label="党小组" prop="partygroup">
      <el-select v-model="zzjg_form.partygroup" placeholder="请选择党小组">
        <el-option label="第一党小组" value="1" />
        <el-option label="第二党小组" value="2" />
        <el-option label="第三党小组" value="3" />
        <el-option label="第四党小组" value="4" />
      </el-select>
    </el-form-item>
    <el-form-item label="党内分工" prop="labor">
      <el-select v-model="zzjg_form.labor">
        <el-option
          v-for="item in laborArray"
          :key="item.id"
          :label="item.value"
          :value="item.value"
        />
      </el-select>
    </el-form-item>
    <el-form-item label="起任时间" prop="employdate">
      <el-date-picker
        v-model="zzjg_form.employdate"
        value-format="yyyy-MM-dd"
        type="date"
        placeholder="无职务不填"
        style="width: 100%"
      />
    </el-form-item>
    <el-form-item v-if="isedit" label="转入单位时间" prop="transferdate">
      <el-date-picker
        v-model="zzjg_form.transferdate"
        value-format="yyyy-MM-dd"
        type="date"
        placeholder="选填"
        style="width: 100%"
      />
    </el-form-item>
    <el-form-item>
      <el-button type="primary" @click="submitForm('zzjg_form')">立即提交</el-button>
      <el-button @click="resetForm('zzjg_form')">重置</el-button>
    </el-form-item>
  </el-form>
</template>
<script>
import {
  SelectZzmm,
  getGroupNum,
  getLaborArray,
  postUsersInfo,
  updateUsersInfo
} from '@/api/zzxt'
export default {
  name: 'Form',
  props: {
    isedit: { type: Boolean, default: true },
    zzjgForm: { type: Object, default: null },
    totalCount: { type: Number, default: 0 },
    dialogformvisible: { type: Boolean, default: true }
  },
  data: () => ({
    zzjg_form: {},
    laborArray: null,
    dxz_num: {}
  }),
  mounted() {
    this.refresh()
  },
  methods: {
    refresh() {
      SelectZzmm().then(data => {
        this.category = data
      })
      getGroupNum().then(data => {
        this.dxz_num = data
      })
      getLaborArray().then(data => {
        this.laborArray = data
      })
      this.title = '添加人员信息'
      this.zzjg_form = this.zzjgForm
    },
    submitForm(formName) {
      this.$refs[formName].validate(valid => {
        if (valid) {
          alert('submit!')
        } else {
          console.log('error submit!!')
          return false
        }
      })
      this.loading = true
      if (this.isedit === true) {
        this.zzjg_form['id'] = this.totalCount + 1
        postUsersInfo(this.zzjg_form)
          .then(data => {
            this.$message.success('添加成功')
          })
          .finally(() => {
            this.loading = false
          })
      } else {
        updateUsersInfo(this.zzjg_form)
          .then(data => {
            this.$message.success('修改成功')
          })
          .finally(() => {
            this.loading = false
          })
      }
      this.$emit('update:dialogformvisible', false)
    },
    resetForm(formName) {
      this.$refs[formName].resetFields()
    }
  }
}
</script>
